<!-- 继承blog/base.html 文件 -->
{% extends "blog/base.html" %}
<!-- 加载自定义标签 -->
{% load blog_tags %}

<!-- 使用此处标题块内容替换blog/base.html文件中标题块 -->
{% block title %}{{ post.title }}{% endblock %}
<!-- 使用此处内容块代码替换blog/base.html文件中内容块-->
<!-- 继承base.html与标题块代码均已经省略未显示 -->
{% block content %}
<!-- 文章详情、分享文章等代码均已省略未显示-->
 <h1>{{ post.title }}</h1>
 <!-- 添加评论标题-->
 <p class="date">
 Published {{ post.publish }} by {{ post.author }}
 </p >
 {{ post.body|markdown
 }}

 <!-- 增加分享文章链接，链接地址自动根据路由名称生成 -->
 <p>
    <a href=" "blog:post_share" post.id %}">
    Share this post
    </a >
 </p >

<!-- 显示相似文章 -->
<!-- 标题 -->
<h2>Similar posts</h2>
<!-- 对于每篇相似文章，显示其标题并变为链接支持跳转 -->
{% for post in similar_posts %} 
 <p>
 {{ post.title }}
 </p >
<!-- 若没有相似文章显示如下内容 -->
{% empty %}
 There are no similar posts yet.
{% endfor%} 

<!-- 文章详情、分享文章等代码无变化均已省略未显示-->
<!-- 显示评论总数 -->
<!-- with标签的作用是对变量进行重命名 -->
 {% with comments.count as total_comments %}
<h2>
 <!-- pluralize 过滤器叫做复数过滤器，当前面的数量是大于1的则自动为comment添加s，适用于英文-->
 {{ total_comments }} comment{{ total_comments|pluralize }}
</h2>
 {% endwith %}
<!-- 遍历所有评论信息并显示-->
{% for comment in comments %}
<div class="comment">
    <p class="info">
    <!-- forloop.counter 标签自动生成循环元素的序号 -->
    Comment {{ forloop.counter }} by {{ comment.name }}
    {{ comment.created }}
    </p >
    {{comment.body|linebreaks }}
</div>
<!-- 如果没有评论，显示如下信息 -->
 {% empty %}
     <p>There are no comments yet.</p >
 {% endfor %}
<!-- 如果是新评论，提示你已经评论 -->
{% if new_comment %}
<h2>Your comment has been added.</h2>
<!-- 否则显示添加新评论并显示评论表单-->
 {% else %} 
     <h2>Add a new comment</h2>
     <form method="post">
     <!-- 根据后端评论表单自动生成前端评论表单 -->
     {{ comment_form.as_p }}
      <!-- 防止远程跨域劫持攻击 -->
     {% csrf_token %}
     <!-- 提交评论按钮 -->
     <p><input type="submit" value="Add comment"></p >
    </form>
 {% endif %}
{% endblock %}